﻿var tabWitdh = 124; //每个选项卡宽度
var tabsWidth = 0; //选项卡容器宽度
var tabMaxCount = 0; //最多可显示的选项卡数量
var tabs = new Array(); //选项卡数组
var topHeight = 100;
var btnHideMenuLeft, btnHideMenuTop = 0;
var btnHideTopLeft, btnHideTopTop = 0;
var mainMenuDivWidth = 0;
$(function () {
    topHeight = $("#top").height();
    mainMenuDivWidth = $("#mainMenuDiv").width();
    $("#mainTable").height($(window).height() - topHeight);
    $("#mainMenuDiv").height($("#mainTable").height());
    $("#main").height($("#mainTable").height() - $("#tabs").height());

    $("#btnHideMenu").click(function () { hideMenu(); });
    $(window).click(function () { $("#tabsHide").hide(300); });
    $("#main").click(function () { $("#tabsHide").hide(300); });
    btnHideMenuTop = $("#mainTable").height() / 2 - 10 + topHeight;
    btnHideMenuLeft = $("#mainMenuDiv").width() - $("#btnHideMenu").width();
    $("#btnHideMenu").offset({ top: btnHideMenuTop, left: btnHideMenuLeft });

    $("#btnHideTop").click(function () { hideTop(); });
    btnHideTopLeft = ($(window).width() - $("#btnHideTop").width()) / 2;
    btnHideTopTop = topHeight - $("#btnHideTop").height();
    $("#btnHideTop").offset({ top: btnHideTopTop, left: btnHideTopLeft });

    $("#tabsHide").offset({ left: $(window).width() - 125, top: topHeight + 33 });
    if (initMenu) {
        initMenu();
    }
    tabsWidth = $("#tabs").width() - 32;
    tabMaxCount = tabsWidth / tabWitdh;
});

function hideMenu() {
    if ($("#mainMenuDiv").width() != 0) {
        $("#mainMenuDiv").animate({ width: "0px" }, 300);
        $("#btnHideMenu").animate({ left: "0px" }, 300);
        $("#btnHideMenu").attr("class", "menuHideBtn");
        $("#btnHideMenu").text(">");
    } else {
        $("#mainMenuDiv").animate({ width: mainMenuDivWidth + "px" }, 300);
        $("#btnHideMenu").animate({ left: btnHideMenuLeft + "px" }, 300);
        $("#btnHideMenu").attr("class", "menuShowBtn");
        $("#btnHideMenu").text("<");
    }
}

function hideTop() {
    if ($("#top:hidden").length == 0) {
        $("#top").slideUp(300);
        $("#btnHideTop").animate({ top: "0px" }, 300);
        $("#btnHideTop").attr("class", "topHideBtn");
        $("#btnHideTop").text("∨");
        $("#mainMenuDiv").height($("#mainMenuDiv").height() + topHeight);
    } else {
        $("#top").slideDown(300);
        $("#btnHideTop").animate({ top: btnHideTopTop + "px" }, 300);
        $("#btnHideTop").attr("class", "topShowBtn");
        $("#btnHideTop").text("∧");
        $("#mainMenuDiv").height($("#mainMenuDiv").height() - topHeight);
    }
    $("#mainMenu").mvcmenu("refresh");
}

function closeTab(id) {
    $("#" + id).remove();
    $("#tab_" + id).remove();
    var item = new Object({ id: id, text: "", url: "" });
    removeTab(item);
    $("#h_" + id).remove();
    var showTabs = $("#tabs").children();
    if (showTabs.length < tabMaxCount) {
        for (var i = 0; i < tabs.length; i++) {
            if (tabs[i].hidden) {
                tabs[i].hidden = false;
                var span = $("<span id='tab_" + tabs[i].id + "' class='actived' onclick='openTab(\"" + tabs[i].id + "\",\"" + tabs[i].text + "\",\"" + tabs[i].url + "\");'><label title='" + tabs[i].text + "'>" + tabs[i].text + "</label><a href='javascript:closeTab(\"" + tabs[i].id + "\")' class='ui-icon ui-icon-closethick'></a></span>");
                $("#btnShowTab").before(span);
                showTabs = $("#tabs").children();
                break;
            }
        }
    }
    if (showTabs.length > 1) {
        showTabs[showTabs.length - 2].click();
    }
}

function openTab(id, text, url) {
    $("#tabsHide").hide(300);
    var exists = false;
    $("#tabs").children().each(function () {
        if ($(this).attr("id") == "tab_" + id) {
            $(this).attr("class", "actived");
            exists = true;
        } else {
            $(this).attr("class", "");
        }
    });

    $("#main").children().each(function () {
        if ($(this).attr("id") == id) {
            $(this).slideDown(500);
        } else {
            $(this).fadeOut();
        }
    });
    if (!exists) {
        var span = $("<span id='tab_" + id + "' class='actived' onclick='openTab(\"" + id + "\",\"" + text + "\",\"" + url + "\");'><label title='" + text + "'>" + text + "</label><a href='javascript:closeTab(\"" + id + "\")' class='ui-icon ui-icon-closethick'></a></span>");
        var item = new Object({ id: id, text: text, url: url, hidden: false });
        removeTab(item);
        tabs.push(item);
        if (tabs.length > tabMaxCount) {//超出
            item = $("#tabs").children()[0];
            $($("#tabs").children()[0]).remove();
            for (var i = 0; i < tabs.length; i++) {
                if ("tab_" + tabs[i].id == item.id) {
                    tabs[i].hidden = true;
                    break;
                }
            }
        }

        var tabsHide = $("#tabsHide").children();
        var hideExists = false;
        for (var i = 0; i < tabsHide.length; i++) {
            if (tabsHide[i].id == "h_" + id) {
                hideExists = true;
                break;
            }
        }
        if (!hideExists) {
            $("#tabsHide").append("<span id=h_" + id + " onclick='openTab(\"" + id + "\",\"" + text + "\",\"" + url + "\");' title='" + text + "'>" + text + "</span>");
        }

        $("#btnShowTab").before(span);
        var iframe = "<iframe id='" + id + "' src='" + url + "' frameborder='0'></iframe>";
        $("#main").append(iframe);
        $("#main").children()[$("#main").children().length - 1].focus();
    }
}

function showTab() {
    if ($("#tabsHide:hidden").length == 1) {
        $("#tabsHide").show(300);
        if ($("#top:hidden").length == 0) {
            $("#tabsHide").offset({ top: topHeight + 33 });
        } else {
            $("#tabsHide").offset({ top: 33 });
        }
    } else {
        $("#tabsHide").hide(300);
    }
}

function removeTab(item) {
    for (var i = 0; i < tabs.length; i++) {
        if (tabs[i].id == item.id) {
            tabs.splice(i, 1);
            return;
        }
    }
}